<template>
  <div>
    home
    <button @click="handleToAbout">handleToABout</button>
    <button @click="$router.replace('/about')">replaceAbout</button>
    <router-link to="/home/kid">homekid</router-link>
    <router-view></router-view>
  </div>
</template>

<script>
import {useRouter} from 'vue-router'
export default {
  /***
   * router.go(1) 前进一步
   * router.go(-1) 后退一步
   * router.forward()前进一步
   * router.back() 后退一步
   * router.replace(/about) 替换
   */
  setup() {
    const router = useRouter()
    const handleToAbout = () => {
      router.push({
        path:'/about',
        query:{
          name:"chanqi",
          age:'18'
        }
      })
    }
    return {handleToAbout};
  },
};
</script>

<style lang="scss" scoped>
</style>